<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>详情页</title>
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <link rel="stylesheet" href="bootstrap4/dist/css/bootstrap.css">
    <link rel="stylesheet" href="css/nav-bottom.css">
    <script src="bootstrap4/dist/js/jquery.slim.min.js"></script>
    <script src="bootstrap4/dist/js/bootstrap.bundle.min.js"></script>
    <script src="js/jquery-3.5.1.js"></script>
    <script src="js/json.js"></script>
    <link rel="stylesheet" href="css/cart.css">
    <script src="js/details.js"></script>
<!--    按钮切换数量-->
    <style>
        h2 {
            font-size: 2rem;
        }
        p {
            font-size: 1rem;
            text-align: center;
            color: #cea461;
        }


    </style>
</head>
<body>
<div class="container-fluid">
    <div class="goods">
<!--        商品详情，由js生成-->
    </div>
    <div class="shop-bottom row w-100">
        <div class="col-4">
            <input type="button" class="num-prev d-inline-block" value="-">
            <input type="number" class="num d-inline-block position-relative" style="bottom: .2rem" value="0">
            <input type="button" class="num-next d-inline-block" value="+">
        </div>
        <div class="col-4" style="position: absolute;top:0;left: 33%">
            总价
            <span class="red">
                ￥
                <span class="money-all">
                    336
                </span>
            </span>
        </div>
        <a href="javascript:void(0)" id="shopping" style="position: absolute;top:0;left: 66%" class="bgc-red d-block col-4">前往购物车</a>
    </div>
</div>
<!--底部导航栏 开始-->
<ul class="nav nav-pills nav-fill fixed-bottom" id="footer_nav">
    <li class="nav-item">
        <a class="nav-link" href="index.html">
            <div class="img"></div>
            首页
        </a>
    </li>
    <li class="nav-item">
        <a class="nav-link" href="list.html">
            <div class="img"></div>
            列表
        </a>
    </li>
    <li class="nav-item">
        <a class="nav-link" href="cart.html">
            <div class="img"></div>
            购物袋
        </a>
    </li>
    <li class="nav-item">
        <a class="nav-link nav-active" href="javascript:;">
            <div class="img"></div>
            我的
        </a>
    </li>
</ul>
<script !src="">
</script>
<!--底部导航栏 结束-->
</body>
</html>